<!--此页面为安全隐患列表页面-->

<template>
  <div class="no-padding app-container">
    <lst-page-container>
      <!--隐患查询过滤条件表单-->
      <template slot="query">
        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="90px">
          <!--          <el-form-item label="隐患描述" prop="questionDesc">-->
          <!--            &lt;!&ndash;            <choose-question></choose-question>&ndash;&gt;-->
          <!--            <el-input-->
          <!--                v-model="queryParams.questionDesc"-->
          <!--                placeholder="请输入隐患描述"-->
          <!--                clearable-->
          <!--                style="width: 240px"-->
          <!--                @keyup.enter.native="handleQuery"-->
          <!--            />-->
          <!--          </el-form-item>-->
          <el-form-item label="隐患类别" prop="questionTypeCode">
            <choose-question v-model="queryParams.questionTypeCode"></choose-question>
          </el-form-item>
          <el-form-item label="隐患年份" prop="questionYear">
            <el-date-picker
                v-model="queryParams.questionYear"
                align="right"
                type="year"
                format="yyyy"
                placeholder="选择年">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="整改进度" prop="schedule">
            <el-select v-model="queryParams.schedule" placeholder="请选择" clearable>
              <el-option
                  v-for="dict in dict.type.defect_question_schedule"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item v-if="handelCode == HANDEL_CODE_CONFIG.REVIEW_DATA" label="状态" prop="status">
            <el-select v-model="queryParams.status" placeholder="请选择" clearable>
              <el-option
                  v-for="dict in dict.type.defect_question_schedule"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
              />
            </el-select>
          </el-form-item>
          <!--功能按钮-->
          <el-form-item>
            <el-button v-for="(item,index) in getBtList('HANDEL_BT')" v-show="item.filterFun({inspectInfo,handelCode})"
                       :type="item.type" :icon="item.icon"
                       :size="item.size" @click="clickHandel(item,item.baseParam)">{{ item.label }}
            </el-button>
          </el-form-item>
        </el-form>
      </template>

      <template slot="handel" v-if="handelCode == HANDEL_CODE_CONFIG.REVIEW_DATA">
        <div class="statistics-con">
          总提安全交隐患数<span class="total">{{ statisticsData.total }}</span>条，当前已完成隐患数：<span class="count">{{
            statisticsData.count
          }}</span>条。
        </div>
      </template>

      <!--隐患列表-->
      <template slot="table">
        <el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">
          <el-table-column v-if="handelCode == HANDEL_CODE_CONFIG.REVIEW_DATA" type="selection" width="55"
                           align="center"/>


          <el-table-column label="隐患分类名称" align="center" prop="questionTypeName"/>
          <el-table-column label="隐患描述" align="center" prop="questionDesc"/>
          <el-table-column label="隐患年份" align="center" prop="questionYear"/>
          <el-table-column label="状态" align="center" prop="taskDriverStateName"/>
          <el-table-column label="整改进度" align="center" prop="schedule">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.defect_question_schedule" :value="scope.row.schedule"/>
            </template>
          </el-table-column>
          <el-table-column label="整改完成情况" align="center" prop="situation"/>

          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
            <template slot-scope="scope">
              <el-button v-for="(item,index) in getBtList('TABLE_BT')"
                         v-show="item.filterFun({inspectInfo,handelCode,row:scope.row})"
                         :type="item.type" :icon="item.icon"
                         :size="item.size"
                         @click="clickHandel(item,item.baseParam != null ? {...item.baseParam, ...scope.row} : scope.row)">
                {{ item.label }}
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </template>
      <!--分页区-->
      <template slot="pageDisplay">
        <pagination
            v-show="total>0"
            :total="total"
            :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize"
            @pagination="getList"
        />
      </template>
    </lst-page-container>

  </div>
</template>

<script>
import {
  delDefectQuestion,
  resetPwd,
  revokeSubmit,
  getDefectQuestionList, queryWaitCheckQuestion, checkDefectQuestion
} from "@/api/securityCheck/defect/defectQuestion.js";
import {subPageMixins} from './subPageMixins'
import ChooseQuestion from "@/views/securityCheck/components/chooseQuestion.vue";
import {PAGE_TYPE, QUESTION_STATE} from "@/constantData";
import {LIST_PAGE_FUN} from "@/views/securityCheck/defectQuestion/listPage/subPage/config";
import {isArr} from "@/utils/arrayUtil";
import {HANDEL_CODE_CONFIG} from "@/views/securityCheck/ztDefectInspect/components/eventConfig";

export default {
  mixins: [subPageMixins],
  dicts: ['defect_question_schedule', 'enum_user_type'],
  name: "sysUser_list",
  components: {
    ChooseQuestion
  },
  data() {
    return {
      QUESTION_STATE,
      PAGE_TYPE,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        questionDesc: null,
        inspectId: this.inspectInfo.id,
        sceneId: this.handelCode,
        nodeSerialNo: this.nodeSerialNo,
        instanceNo: this.instanceNo,
        questionTypeCode: null,
        questionYear: null,
        schedule: null,
        status: null
      },
      dataList: [],  //该数组用于接收隐患清单
      total: 0,
      loading: false,
      open: false,
      // 选中数组
      ids: [],
      statisticsData: {
        total: 3000,
        count: 200
      }
    }
  },
  watch: {
    'queryParams.questionTypeCode': {
      handler() {
        console.log(this.queryParams.questionTypeCode)
      },
      deep: true
    }
  },
  methods: {
    batchAudit({result, url}) {
      let {ids} = this;
      if (!isArr(ids)) {
        this.$modal.msgError("请选择隐患数据");
        return
      }
      this.examineAndApprove(url, result, ids)
    },
    audit({id, result, url}) {
      this.examineAndApprove(url, result, [id])
    },
    examineAndApprove(url, result, questionIds) {
      let {inspectInfo: {id: inspectId}, handelCode: sceneId, nodeSerialNo, instanceNo,} = this
      this.$prompt('请输入审批说明', "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        closeOnClickModal: false,
      }).then(({value: remark}) => {
        checkDefectQuestion(url, {
          sceneId,
          inspectId,
          nodeSerialNo,
          instanceNo,
          result,
          questionIds,
          remark
        }).then(res => {
          this.$modal.msgSuccess("审核成功");
          this.getList()
        })
      }).catch(() => {
      });
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        questionDesc: null,
        inspectId: this.inspectInfo.id,
        sceneId: this.handelCode,
        nodeSerialNo: this.nodeSerialNo,
        instanceNo: this.instanceNo,
        questionTypeCode: null,
        questionYear: null,
        schedule: null,
      }
      this.handleQuery();
    },

    /** 导出按钮操作 */
    handleExport() {

    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.multiple = !selection.length
    },

    /**
     * 撤回按钮回调函数
     */
    handleRevoke(row) {
      this.$modal.confirm('是否确认撤回当前数据项？').then(function () {
        return revokeSubmit({id: row.id});
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("撤回成功");
      }).catch(() => {
      });
    },

    /**
     * 删除按钮操作
     * @param row
     */
    handleDelete(row) {

      this.$modal.confirm('是否确认删除当前数据项？').then(function () {
        return delDefectQuestion(row.id);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {
      });
    },

    /** 新增隐患按钮回调函数 */
    handleAdd({id}) {
      this.goInfoPage({path: '/securityCheck/defectQuestionEdit', id,})
    },
    /** 编辑按钮回调函数 */
    handleInfo({id}) {
      this.goInfoPage({path: '/securityCheck/defectQuestionInfo', id})
    },

    /** 搜索按钮回调函数 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },

    /**
     * 此函数用于获取隐患清单
     */
    getList() {
      this.loading = true;
      let {handelCode, HANDEL_CODE_CONFIG} = this

      getDefectQuestionList(this.queryParams).then(response => {
        this.dataList = response.rows;
        this.total = response.total;
        this.loading = false;
      });

      // if (handelCode == HANDEL_CODE_CONFIG.ADD_HIDDEN_DANGER) {
      //   getDefectQuestionList(this.queryParams).then(response => {
      //     this.dataList = response.rows;
      //     this.total = response.total;
      //     this.loading = false;
      //   });
      // }
      // if (handelCode == HANDEL_CODE_CONFIG.REVIEW_DATA_FGLDQR) {
      //   queryWaitCheckQuestion(this.queryParams).then(response => {
      //     this.dataList = response.rows;
      //     this.total = response.total;
      //     this.loading = false;
      //   });
      // }
    },

    getStatisticsData() {
      this.statisticsData = {
        total: 3000,
        count: 200
      }
    },
  },
  created() {
    if (this.handelCode == HANDEL_CODE_CONFIG.ADD_HIDDEN_DANGER) {
      this.getStatisticsData()
    }
  }
}
</script>

<style lang="scss" scoped>
.statistics-con {
  width: 100%;
  height: 45px;
  background: rgba(32, 125, 255, 0.06);
  box-sizing: border-box;
  padding: 0 15px;
  display: flex;
  align-items: center;

  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0px;
  color: rgba(96, 98, 102, 1);

  .total {
  }

  .count {
    color: rgba(32, 125, 255, 1);
  }
}
</style>
